Bibliothek

HTML Kurs

von Gabrielle

Willkommen zu meinem kleinen HTML Kurs für Anfänger und Fortgeschrittene!
Hier will ich euch zeigen, wie ihr eine eigene Seite im World Wide Web aufbauen könnt.

HTML ist die Sprache, in der mehr oder weniger alle Webseiten im Internet gebaut sind. Jeder Browser kann sie lesen und die Befehle interpretieren, die weltweit gleich sind und aus einem Haufen Textcode das machen, was wir als Internetseite bezeichnen.

Dieser Kurs richtet sich vorrangig an Mitarbeiter Dol Morguls, die die Seite mit gestalten und füllen möchten, an Schulleiter und jene die es werden wollen, sowie an alle Interessierten.

Ich habe alle Informationen auf Online-Schulen wie Dol Morgul ausgelegt, um euch den Aufbau eurer eigenen Schule oder die Mitarbeit hier zu erleichtern.

Warum ich das mache? Um euch die Möglichkeit zu geben leichter als Schulleitung/Mitarbeiter in die faszinierende Welt der Online-Schulen einzutauchen und um euch zu zeigen, dass es gar nicht so schwer ist, seine eigenen Gedanken ins Internet zu bringen.

Ich bin immer interessiert an neuen guten Schulen und würde mich freuen, wenn ihr mit mir Kontakt aufnehmt, wenn ihr eure Schule nach meinem Kurs gebaut habt oder Fragen und Ideen habt. Benutzt dafür einfach das Kontaktformular Dol Morguls.

Tipps für eine gelungene Seite

Ich möchte mit den nachfolgenden Tipps nicht sagen, dass ich mich für den besten Seitenbetreiber oder ähnliches halte. Natürlich muss ich selber noch viel lernen und ich weiß, dass Dol Morgul nicht perfekt ist. Trotzdem habe ich mir erlaubt eine Liste mit Fakten zusammen zu stellen, die mich an anderen Schulen gestört haben und von denen ich denke, dass sie allen helfen können. Daher gilt: Anfänger bitte LESEN !

~ Oh wow, du willst ein Hogwarts aufbauen? Genial!

Leider hatten diese Idee vor dir schon zig andere Leute. Also wenn du nicht eine supergeniale noch nie dagewesene Idee hast, fang am besten gar nicht erst an. Es sei denn du willst einer von vielen werden.

~ HTML? Ach nee, Beepworld, Oyla und Konsorten reichen doch vollkommen aus!

Klar, wenn du auf massenhaft Werbung, Fehler und Standart-Designs stehst... Eine gute Alternative ist ein HTML Kurs (wie dieser ^^), ein Anbieter wie z.B. Funpic und etwas Geduld. Funpic hat zwar auch etwas Werbung, sieht aber viel professioneller und individueller aus.

~ Das sind ja tolle Bilder! Die müssen unbedingt auf die Seite! Natürlich möglichst groß und farbenfroh!

Au ja, und der Besucher holt sich einen Tee, bis die Seite mit den vielen Bildern in Mb-Größe geladen hat. Leider weiß er vorher nicht, dass die Hintergründe SO bunt sind, dass er eh nichts lesen können wird. Also lieber mal schlicht und mit weniger Grafiken.
Allgemein sollten Bilder nicht größer als 20 KB sein. Hintergründe dürfen nicht zu grell sein und keine Muster oder Motive zeigen, die das Lesen der Schrift darauf erschweren. Wenn ihr unbedingt ein Bild verwenden wollt, könnt ihr es blasser machen.

Bei Bildern müsst ihr zudem drauf achten, dass ihr nicht einfach ungefragt Bilder oder Grafiken aus Google oder von anderen Seiten verwenden dürft. Sie sind meist durch ein Copyright geschützt. Am besten ist es, wenn ihr selbst eure Bilder erstellt.

~ Schon wieder blaue Schrift in Times? Nee, diesmal nehme ich pink in Arial!

Die Besucher freuen sich sicher über Abwechslung. Ob sie die Seite dann aber so ganz ernst nehmen, wage ich zu bezweifeln. Die ganze Seite sollte ein einheitliches Design (= Farbwahl, Layout und Hintergrund) haben und eine (!) gut lesbare Schrift verwenden. Beachte dabei, dass ausgefallene Schriftarten nicht auf allen Rechnern installiert sind und deine Seite bei anderen dann eventuell ganz anders aussehen wird. Daher ist empfehlenswert, sich auf die "typischen" Schriften wie Arial, Tahoma, Times new Roman, etc. zu beschränken.

~ Aufräumen ist real schon so öde, da ist es doch nicht schlimm, wenn die Links im Menü etwas durcheinander sind.

Klar, die Seite ist auch sicher so toll, dass jeder gerne seine Zeit investiert, um einen link zu suchen. Kaputte Links sind übrigens genauso gern gesehen! (Achtung, das war Ironie.)
Grundsätzlich gilt: Ein Hauptmenü sollte höchstens 7 Punkte beinhalten. Alles darüber hinaus ist vom Besucher nicht mehr ohne weiteres fassbar. Ihr solltet eure Inhalte gut durchdacht nach Themen gliedern.

~ Bald geht es LOOOOS!!!!

Ja klar, aber erst, wenn du den Besucher zurücklockst, den du mit diesem Rumgeschreie gerade vertrieben hast. Ein Ausrufezeichen genügt vollkommen und auch wer sich an die deutsche Rechtschreibung hält (dazu gehört Großschreibung), wird nicht verachtet. Apropos, "Baustellenseiten" werden absolut nicht gerne gesehen. Also wenn du nichts zu sagen hast, dann deute nicht auch noch drauf hin.

~ Ach ja, ich habe heute Geburtstag!

Glückwunsch! Aber eigentlich interessiert mich das nicht wirklich...
Wenn du eine private Seite über dich selbst betreibst, sind solche Angaben völlig in Ordnung. Handelt es sich bei deiner Seite aber um eine Online-Schule wie Dol Morgul, sollten solche privaten Informationen nicht groß auf die Startseite geschrieben werden, denn es interessiert deine Besucher nicht und stellt dich zu sehr in den Mittelpunkt.
Wenn du trotzdem gerne mit anderen online feiern willst, lade zu einer kleinen Feier im Chat ein oder verschenke selber etwas.

~ Hallo ich heiße Mona Lisa und wohne in der Wiesenalle! Wer mehr über mich wissen will kann überall auf der Seite Infos über mich finden :)

Absolutes NO GO! Wie bereits oben erwähnt gehen deine privaten Informationen niemanden was an und sie interessieren auch niemanden (hart aber wahr, sorry) und selbst wenn du die Schulleitung bist, solltest du die Schule nicht dafür missbrauchen, dein Ego raushängen zu lassen. Und apropos Missbrauch: reale Private Angaben haben absolut nichts im Internet verloren!

~ Viel Spaß beim Lernen!! ^^ XDD ;)

Smilies kannst du in einem persönlicheren Text oder im Chat verwenden, aber bitte Müll deine Startseite nicht damit zu.. Das lässt dich als kleines aufgedrehtes Kind dastehen.

~ Das ist ja ein tolles Lied! Das muss unbedingt als Hintergrundmusik auf die Homepage!

Nur zu, wenn du gerne allein bleiben willst. Abgesehen von dir finden viele die Musik wohl eher nervend. Zudem beansprucht sie viel Ladezeit UND ist wie auch Bilder meist Copyright geschützt.

~ Ein Update pro Monat ist doch mehr als genug.

Ja, viele von uns haben nicht die Zeit, sich täglich mit einer Homepage zu befassen, aber das muss der Besucher ja nicht merken. Also verzichte besser auf Infos wie "zuletzt geändert am ..." wenn das Datum schon Wochen zurück liegt.

~ Und das Wichtigste zum Schluss:

Wage es gar nicht erst von anderen Seiten (vor allem unsere) Texte und Inhalte zu kopieren! Sich Ideen und Inspiration holen ist völlig ok, aber keiner wird dich ernst nehmen, wenn deine Seite nur aus fremdem Material besteht. Kopierer werden verachtet und ignoriert!

Nichtsdestotrotz, viel Spaß mit dem nachfolgenden Kurs :P

--------------------------------------------

Willkommen im zweiten Abschnitt des HTML Kurses speziell für Dolianer! In dieser Stunde will ich euch die Grundlagen näher bringen.

HTML - Was ist das eigentlich?

Nun, "HTML" bedeutet "Hypertext Markup Language" oder einfach nur Hypertext-Auszeichnungssprache. Es ist also die Sprache, mit der die Seiten im Internet geschrieben werden, durch die sie ihr Aussehen, ihre Funktionsfähigkeit und ihren Inhalt bekommen. Neben HTML gibt es noch andere Sprachen, wie CSS und PHP, aber für diese müsst ihr erst die Grundlagen kennen.

CSS Beispielsweise dient der tatsächlichen Gestaltung der zuvor in HTML gebauten Elemente. Welche Farbe hat welche Schrift, wie groß wird die Schrift dargestellt, welches Hintergrundbild und welchen Rahmen verwenden wir?

PHP und viele andere Sprachen dienen der Befüllung der Seite mit dynamischem Inhalt: Login-Systeme, wo jedes Mitglied ein eigenes Profil hat, automatisch hochrechnende Punktezahlen, usw.

Wozu also dieser Kurs?

Womöglich seid ihr engagierter Schüler oder Lehrer und wollt einen Job in Dol Morgul annehmen. Dann ist es immer sehr von Vorteil, wenn ihr HTML beherrscht, da unsere Schule darauf aufgebaut ist. Aber vielleicht wollt ihr auch eine eigene Schule aufbauen oder einfach nur eine Seite über euch gestalten.

Aber es gibt doch Beepworld, Oyla und so weiter, oder gar richtige HTML Editoren, wozu also die Umstände?

Klar, mittlerweile gibt es unzählige Anbieter im Internet, die euch Webspace mit einem eingebauten Editor geben, sodass ihr dort nur noch euren Inhalt eingebt und *schwupp* eine vollständige Seite heraus bekommt. Das Problem daran ist nur, dass bestimmt tausend andere Leute auf haargenau die selbe Idee gekommen sind und es schlussendlich zig Seiten gibt, die vollkommen identisch sind.
Abgesehen davon sind diese Seiten oftmals nur so mit Werbung überfüllt, und da wird mir wohl jeder zustimmen, dass das nicht besonders hübsch ist. Wer eine gute Homepage erstellen will, der sollte sich auch etwas Mühe dafür geben.

Der Plan für den Kurs sieht wie folgt aus:
1. Einführung, Grundlagen
2. Textformatierung, Schrift, Bilder
3. Tabellen, Verlinkung, Webspace, Onlinestellung
4. Was brauche ich für eine gute Online-Schule?

----------------------------------------------------------------

Kommen wir nun zum Grundlegenden:

HTML Dateien könnt ihr in jedem normalen Texteditor schreiben. Wenn ihr keinen bestimmten Editor installieren wollt, benutzt dazu den "Editor" von Windows bzw. "Wordpad". Die damit erstellten Dateien zeichnen sich dadurch aus, dass sie ein .html am Ende des Dateinamens haben. Hättet ihr nicht gedacht, oder? ^^

HTML Dateien können mit einem Editor oder dem Webbrowser (Firefox, Internet Explorer, Opera...) geöffnet werden.

Das Grundgerüst einer jeden HTML Seite ist immer gleich:
<hr>

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>...</title>
</head>

<body>
Hier steht dein Text.
</body>
</html>

Die "<>" werden "tags" genannt. In ihnen stehen alle Befehle, die sich auf den Inhalt, die Funktionsweise und das Aussehen etc. der Seite beziehen. Diese Befehle müsst ihr lernen bzw. euch gut notieren, aber viele von ihnen ergeben sich von selbst, wenn man etwas Englisch beherrscht.

Tags werden mit <befehl> begonnen und mit </befehl> geschlossen. Befehle, die nicht geschlossen werden (und sei es nur ein > das fehlt), werden vom Browser ignoriert und nicht dargestellt! Viele Autoren sind schon an solchen Kleinigkeiten verzweifelt ^^
Hierbei gibt es aber ein paar Ausnahmen, die von sich aus nicht geschlossen werden müssen, wie z.B. der Zeilenumbruch 

Schauen wir uns nun das Grundgerüst etwas genauer an:

<!DOCTYPE html>

Sagt dem Browser, welche HTML Version verwendet wird. Dieser Befehl wird nicht geschlossen.

<html>

sagt aus, dass es sich hierbei um eine HTML Datei handelt.

<head>

enthält alle Informationen, die nicht auf der Seite zu sehen sind, also z.B. welche Sprache benutzt wird oder um welche HTML Version es sich handelt. Dies könnt ihr als Anfänger aber getrost ignorieren.

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

Beispielsweise ist ein Hinweis auf den Zeichencode utf-8.

<title>

Ist der Titel der Seite, der oben in der Browserleiste auftaucht. Er ist nicht zwingend notwendig, dient aber erheblich der Übersicht. Eine gute Seite hat immer einen Titel.

<body>

Alles, was sich zwischen diesen beiden Tags befindet, erscheint auch auf der Homepage und kann von allen gesehen werden. Hier kommen also eure Texte, Bilder und alles andere hinein.

Schreibt nun dort, wo ich die Punkte gesetzt habe einen Titel eurer ersten Seite und einen Satz in den Body, wie zum Beispiel "Guten Abend." Im Text könnt ihr mit

Absätze machen!

<!DOCTYPE html>
<html>
<head>
<title>Startseite</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>

<body>

Guten Abend! 
Willkommen auf meiner Seite.

</body>
</html>

Speichert die Datei nun ab. Dafür müsst ihr in den Texteditoren auf "speichern unter" gehen und dort ".html" wählen.

Achtet immer darauf, dass der Dateiname keine Sonderzeichen (ä, ö, ü, ß...), keine Leerzeichen und keine Großbuchstaben enthält! Sollte dies doch der Fall sein, kann es nachher im Browser zu Problemen kommen. Versucht auch immer einen treffenden Namen zu wählen, damit ihr den Überblick behaltet.

"meine erste Seite.html" wäre also alles andere als richtig, während
"html_uebung1.html" oder "meine_erste_seite.html" ok wären.

Speichert die Datei also ab und öffnet sie wieder. Es sollte sich nun ein Internetbrowser öffnen, in dem ein weißes Fenster mit eurem Satz darin auftaucht. Ist dies nicht so, könnt ihr per Rechtsklick - öffnen mit einen Browser auswählen.

Das ist eigentlich schon das große Geheimnis.
Diese Seite ist jetzt aber noch nicht im Internet, sondern befindet sich noch immer auf eurem Computer. Wie ihr sie hochladen könnt, erzähle ich euch am Ende.

Bis zur nächsten Stunde.

---------------------------------

Weiter gehts mit der 3. Lektion :)
Ich hoff, ihr seid bis jetzt mitgekommen und habt alles verstanden? Wenn dem nicht so ist, könnt ihr mir gerne eure Fragen per Kontaktformular zukommen lassen.

Kommen wir nun zu der Struktur eurer Seite. Informationen sind natürlich wichtig, aber so ganz ohne Bild und Format doch nicht so umwerfend, nicht wahr?

Damit ihr im Code-Dschungel nicht den Überblick verliert, könnt ihr euch selbst Kommentare in den Code setzen. Diese werden nicht auf der Seite angezeigt, selbst wenn sie im Body stehen.



Um euren Inhalt auf der Seite nun schön zu formatieren, greifen wir zunächst auf die in HTML gegebenen Strukturierungsmöglichkeiten zu. Schriftart, Farbe, Größe, etc. wird später per CSS eingesetzt.

Einen Zeilenumbruch im Text könnt ihr mit herstellen. Sobald es auftaucht, springt der Text eine Zeile tiefer.

Einen Absatz macht ihr, indem ihr den gesamten Text eines Absatzes zwischen zwei ... setzt, also in etwa so:


Heute war das Wetter schön. 
Gestern hat es geregnet.


So wird automatisch ein Absatz eingefügt.

Mit <hr> könnt ihr zudem ganz unkompliziert eine dünne Trennlinie erstellen, mit der Text gut unterteilt werden kann.

Nun habt ihr noch die Möglichkeit, den Text grob zu gestalten:

Kursiv wird der Text mit Text,
fettgedruckt könnt ihr ihn mit Text erscheinen lassen
und unterstrichen wird er mit Text.

Mit diesen einfachen Mitteln könnt ihr schon viel erreichen.
Natürlich lassen sich tags auch verschachteln. Ihr könnt einen Text also z.B. kursiv machen und nur eines der Wörter unterstreichen:



Heute war das Wetter schön. 
Gestern hat es geregnet.

Außerdem gibt es noch Listen, mit denen ihr Text und besonders Stichpunkte gut sortieren könnt.
Per CSS lassen sich die Listen später noch gestalterisch anpassen. So werden auf vielen Seiten die Navigationen mit einer Liste realisiert und anschließend legt man z.B. Buttons über die Stichpunkte.

Es gibt die sortierte Liste <ol>...</ol> und die unsortierte Liste <ul>...</ul>.
Bei geordneten Listen haben die Stichpunkte jeweils ein 1. 2. 3. ... vor sich stehen,
bei den ungeordneten steht davor ein Symbol, z.B. ein Punkt.

Listen haben folgenden Aufbau:

<ul>
<li> Punkt 1 </li>
<li> Punkt 2 </li>
</ul>

Dabei umfängt der <ul> .. </ul> (oder auch ol natürlich) tag alle Stichpunkte. Diese werden in ein Listenelement <li>...</li> geschrieben.

So können viele Inhalte schnell und übersichtlich dargestellt werden.

Schönen Abend noch.

---------------------------------------

Willkommen zur nächsten Lektion.

Hoffentlich seid ihr mit der Menge an Befehlen aus der letzten Stunde gut zurechtgekommen?
Natürlich gilt auch weiterhin, dass ihr mir eure Fragen jederzeit zukommen lassen könnt. Lasst euch Zeit beim Lernen und versucht nicht, auf Biegen und Brechen eine riesige Homepage zu gestalten. Das geht in den meisten Fällen schief ;)

Als erstes möchte ich euch heute zeigen, wie ihr Hyperlinks einfügt.

Zunächst braucht ihr eine Url z.B. http://www.dolmorgul.de
Im HTML fängt jeder Link mit "http://" an! Es reicht also nicht aus, nur das www.... einzugeben.
Dann braucht ihr noch einen Begriff, der verlinkt werden soll, z.B. "Klick mich". Diesen sieht der Besucher auf der Seite. Der Link wird hinter dem Wort geschlossen, das verlinkt werden soll.
Zusammen sieht das so aus:

<a href="http://www.dolmorgul.de/">Klick mich.</a>
Das a deutet darauf hin, dass es sich um einen Verweis bzw. Link handelt, das href (hyper reference) gibt den Ort oder die Datei an, zu der verwiesen wird.

Das wars auch schon. Ihr könnt jetzt noch angeben, wie der Link geöffnet werden soll:

<a href="link" target="_blank"> öffnet einen Link in einem neuen Fenster.
<a href="URL" target="_self"> ... </a> öffnet einen link im selben Tab. Das ist Standard und muss meist nicht extra angegeben werden.

Mit <a href="URL" title="..."> ... </a> gebt ihr dem Link einen Namen. Dieser wird beim Darüberfahren mit der Maus angezeigt.

Wollt ihr ein Bild irgendwo im Inhalt platzieren, sieht das ähnlich aus:

<img src="http://www.bilddatei.jpg">
Das img deutet darauf hin, dass es sich um ein Bild handelt, src steht für "source" und bezeichnet die Quelle, an der das Bild liegt.
Bild-tags müssen übrigens nicht geschlossen werden :)

ACHTUNG!

Bei Bildern und auch Verlinkungen habt ihr mehrere Möglichkeiten, wie ihr die URL angebt.
Wenn ihr die HTML Dateien, Bilder, etc. auf eurem Rechner liegen habt, könnt nur ihr sie sehen. Würdet ihr also z.B. in einer HTML Datei ein Bild verlinken, das auf eurem PC liegt und schickt dann nur die HTML Datei an einen Freund, so könnte dieser das Bild nicht sehen. Wie auch? Es liegt ja schließlich bei euch.

Abhilfe schafft hier ein eigener Webspace (also ein "Ordner" im Internet, sozusagen), oder ihr ladet die Bilder bei einem Hoster hoch, wie z.B. imageshack.us

Hier erhaltet ihr nun eine Bild-URL, die in etwa so aussieht: http://imageshack.us/a/img11/7738/louisneuava.jpg
Diese könnt ihr nun problemlos verlinken.

Liegen die Dateien auf einem Server in Ordnern, könnt ihr diese auch direkt ansprechen, ohne die ganze URL angeben zu müssen:

="bild.jpg"
"bild.jpg" liegt im selben Ordner wie die HTML Datei, in der darauf zugegriffen wird.

="grafiken/bild.jpg"
"bild.jpg" liegt im Ordner "grafiken", der IN dem Ordner liegt, wie die HTML Datei, in der darauf zugegriffen wird.

="../grafiken/bild.jpg"
"bild.jpg" liegt im Ordner "grafiken", der in einem übergeordneten Ordner liegt, wie die HTML Datei, in der darauf zugegriffen wird.

Oft haben Bilder eine ganz unpassende Größe und erstrecken sich über den ganzen Bildschirmrand. Das könnt ihr aber ändern:

<img src="http://www.bilddatei.jpg" width="10" height="15">

Width verändert die Breite, height die Höhe. Wie genau die Werte sind, hängt natürlich vom Bild und der gewünschten Größe ab. Dabei solltet ihr aber beachten, dass eine Veränderung der Größe im HTML Code nicht das richtige Bild verändert. Wenn ihr also ein Foto mit 2600 x 1700 Pixeln habt, wird das in der Größe 20 x 12 immer noch sehr lange brauchen um zu laden. Besser ist es also, das Bild vorher in einem Grafikprogramm wie Gimp oder Photoshop zu verkleinern.

Die ursprüngliche Größe eines Bildes findet ihr heraus, indem ihr es mit einem Rechtsklick in einem neuen Tab öffnet. Dort steht dann in der Tab Bezeichnung die Größe.

Der Befehl <img src="URL" alt="alternativer Text"> ist zudem hilfreich, denn sollte das Bild nicht angezeigt werden können, wird stattdessen der hier angegebene Text angezeigt.

Nun könnt ihr auch Bilder verlinken:
<a href="http://www.dolmorgul.de"><img src="http://dolmorgul.de/grafiken/layout/dol_logo.png"></a>

----------------------------------------

Nun solltet ihr die Grundlagen des HTML kennen und in der Lage sein, eure eigenen Seiten zu schreiben.
Doch wie genau bekommt man das ganze nun ins Internet?

Ganz einfach.
Ihr braucht dafür erstmal Webspace, also einen Anbieter, der euch im großen weiten Internet etwas Platz gibt. So wie ihr z.B. in einer Zeitung auch jemanden braucht, der eure Anzeige hineinstellt.
Hier gibt es eine Vielzahl an Anbietern und je nach dem, wie viel Werbung man akzeptiert, wie große Datenmengen man hat oder ob und wie viel Geld man investieren will, findet sicher jeder etwas passendes für sich.

Gute Erfahrungen als Anfänger habe ich mit Oyla gemacht, da man dort keine weiteren Programme benötigt und einfach den HTML Code eingeben kann.
Da es aber sehr viel Werbung und eingeschränkte Gestaltungsmöglichkeiten beinhaltet, würde ich eher zu Funpic raten. Beide Anbieter sind kostenlos, Funpic bietet aber sicherlich die größeren Möglichkeiten.

Will man seine Homepage bei Funpic (aber auch anderen) "hosten", benötigt man zusätzlich noch einen FTP Klienten. Dieser ist lediglich dafür da, die Dateien von eurem PC ins Internet zu tragen und auf dem Webspace abzulegen und gibt euch die Möglichkeit die Dateien auf eurem Webspace anzusehen.

Ein sehr schöner und kostenloser Klient ist Filezilla. All diese Programme funktionieren in etwa gleich. Ihr müsst immer erst einen Server dort anmelden und eine Verbindung herstellen. Da ich selber mit Funpic gearbeitet habe, will ich euch die Prozedur kurz erklären:

Nutzt den Link und registriert eure Homepage.
Geht dann im Account auf "webhosting FTP" und gebt dort ein neues Passwort ein. Kopiert den Link, der ungefähr so aussehen sollte: "name.na.funpic.de" und klickt auf aktivieren.
Damit bestätigt ihr, dass ihr die Verwendung von FTP nutzen wollt.

Nun installiert ihr das Programm und geht wie folgt vor:

Optionen -> Servermanager -> neuer Server
gebt einen Namen für den Server ein, der eure Homepage beinhalten wird.

Es öffnet sich ein Fenster. Gebt dort eure Daten ein, die in etwa so aussehen sollten:

Server: name.na.funpic.de
Benutzer: Name
Passwort: euer FTP Passwort (nicht das allgemeine Funpic Pw!)

Alle anderen Angaben brauchen euch nicht zu interessieren.
Klickt auf speichern und fertig ist es ^^

Nun könnt ihr euch über das erste große Symbol in der Leiste mit dem Server verbinden.
Jetzt braucht ihr nur noch eure Dateien von der Festplatte (in der regel im Fenster rechts) auf den Server (Fenster links) legen.
Eure Dateien findet ihr auf der Seite, deren Link so ähnlich aussehen sollte:

http://name.na.funpic.de

Dies ist der Pfad zu eurem Server, wo alle Dateien, also auch Bilder, etc. abgelegt werden können. Wollt ihr, dass der Funpic Link eure richtige URL ist, müsst ihr eurer Startseite den Namen "index.html" geben. Das sagt dem Server, dass er diese Seite als Startseite nutzen soll.

Wenn ihr euch als Mitarbeiter Dol Morguls mit HTML beschäftigt, kann euch auch auf unserem Server ein eigener Platz zur Verfügung gestellt werden. Der Ablauf ist aber nahezu der selbe.

Und damit wären wir auch schon am Ende des technischen Teiles unseres Kurses :)
Ich hoffe, ihr hattet Spaß dabei und werdet auch noch in Zukunft Freude am Codieren haben.

---------------------------------------

Willkommen zu eurer letzten Lektion. Ihr solltet mittlerweile genug über das Schreiben des HTML Codes wissen um euch eine eigene Seite aufbauen zu können. Übt fleißig weiter und lernt selbstständig neue Techniken und Befehle, dann werdet ihr schon bald all eure Vorstellungen auf einer Website realisieren können.

Doch eine Website besteht ja nicht nur aus Code. Der Inhalt ist mindestens genauso wichtig und sollte den Besucher gleich fesseln. Da dieser Kurs insbesondere für angehende Schulleiter geschrieben wurde, will ich euch hier noch eine kleine Anweisung geben, wie ihr eure eigene Schule aufbauen könnt.

Als aller erstes müsst ihr euch darüber im klaren werden, welchen Stil eure Schule haben soll. Wollt ihr eine bekannte Schule wie Hogwarts, Beauxbatons oder Durmstrang nachbauen, müsst ihr euch an die Vorgaben in den Büchern halten und habt nicht viel Freiheiten, was die Häuser angeht.
Entscheidet ihr euch für eine von euch ausgedachte Schule, könnt ihr selbst über das System und den Aufbau etc. bestimmen.

Danach solltet ihr euch für ein System entscheiden. Wollt ihr die Schule ganz alleine leiten oder sie in mehrere Häuser einteilen, die alle einen eigenen Hausleiter haben? Wollt ihr alleine über alles bestimmen, habt ihr sehr viel Arbeit vor euch. Viele Anfänger unterschätzen diesen Aspekt, aber eine Schule in der Größe Dol Morguls alleine zu leiten bedeutet auch, täglich 1-2 Stunden zu investieren. Und das wird immer mehr, je mehr Mitglieder man hat.

Ist dies geklärt, wird es Zeit das Image der Schule festzulegen. Dies ist zwar nicht unbedingt nötig, aber es hilft euch sehr bei der Gestaltung und auf Besucher macht es einen besseren Eindruck, wenn die Schule gleich klar macht, auf welcher Seite ihr steht. Hier kann man die Einteilung gut - neutral - böse nehmen.
Eine böse, dunkelmagische Schule wird sicher kein rosanes, glitzerndes Layout verwenden. Eine neutrale Schule kann sich in beide Richtungen bewegen. Dies kann beispielsweise auch eure Unterrichtsfächer beeinflussen. Eine gute Schule wie Hogwarts wird wohl eher zu Verteidigung gegen die Dunklen Künste tendieren, statt die Dunklen Künste selbst zu lehren.

Nun müsst ihr euch noch überlegen, welche Zielgruppe ihr ansprechen wollt. Eine dunkelmagische Schule wird wohl eher ältere Besucher anziehen, eine süße weißmagier Schule eher kleine Mädchen ;) Dementsprechend solltet ihr eure Schule nun auch gestalten.

Ich empfehle euch, eure Schule erst zum Großteil fertig zu bauen, ehe ihr sie on stellt und Werbung macht. Niemand wird eine Seite ein zweites Mal besuchen, wenn jeder zweite Link ins nichts führt.

Werbung ist auch ein gutes Stichwort. Besonders am Anfang werdet ihr nicht viele Schüler haben (keine Sorge, das geht jedem so). Sobald die Schule steht solltet ihr also fleißig Partnerschulen kontaktieren und Banner tauschen, Leuten von eurer Seite erzählen, euch in Linklisten eintragen und an Veranstaltungen wie der Zauberolympiade teilnehmen. Es kann auch helfen in Gästebüchern anderer Schulen freundlich auf euren Link hinzuweisen, aber seid dann auch so höflich und schreibt ein, zwei nette Sätze über die besuchte Schule.

Im Allgemeinen gilt: Seid als Schulleiter immer nett und höflich anderen Schulleitern, potenziellen Schülern und Besuchern gegenüber. Und ja! Auch ein Schwarzmagier kann nett sein ;)
Ihr werdet als Schulleiter immer das 'Mädchen für Alles' sein und werdet euch damit anfreunden müssen, immer mal für Schüler oder Mitarbeiter kleine Dinge erledigen zu müssen, wie Namensänderungen, Tipps geben oder auch zum 5. Mal zu erklären, wie man sich anmeldet. Solltet ihr euch für so toll halten, dass ihr über eure Schüler herziehen könnt oder in eurer Schule eine Mini-Diktatur veranstaltet, wird es euch nicht mehr lange geben, denn denkt dran: ein Schüler kann sich in wenigen Minuten eine andere Schule suchen ;)

Aber auch wenn das alles nun etwas negativ klingt, so kann ich euch nur sagen, dass ich es in den Jahren, da ich als Mitarbeiter und Schulleiter tätig bin, noch nie bereut habe meine Zeit in diese Projekte zu investieren. Es ist einfach ein wundervolles Gefühl zu sehen, wie die eigene Schule mit jedem Tag wächst, Menschen, die sich sonst vielleicht nie kennengelernt hätten, zueinander finden und Stunde um Stunde im Chat verbringen, ganz zu schweigen von Lob und Danksagungen, die man auch ab und an erhällt.
Ich bin an und mit Dol Morgul gewachsen und das könnt ihr auch. Viel Erfolg wünsche ich und wenn ihr irgendwann ganz oben seid, vergesst nicht, wo eure Wurzeln liegen ;)

In dem Sinne,

Louis de Lioncourt

zurück

Orte

Wichtige Orte

Nützliches

Interaktives

Anderes

Aktivitäten

Dol Morgul

Unterricht

Außerschulisches

Triskele

Ministerien

Orden

Mitarbeit

Events

Wissenswertes

Partner